:root {
    --header: 66px;
    --banner: 680px;
    --color: #fff;
}

/* 头部 */
header {
    top: 0;
    left: 0;
    height: var(--header);
    width: 100%;
    min-width: 1200px;
    z-index: 40;
    background-color: transparent;
    color: var(--color);
    padding: 20px 28px;
    border-bottom: 1px solid #88afe7;
}

/* 头部logo */
header h2 a {
    font-size: 0px;
    display: block;
    width: 140px;
    height: 30px;
    background: url(../images/header-logo.png) no-repeat;
}

/* 头部导航栏 */
header ul li {
    float: left;
    width: 34px;
    line-height: 64px;
    text-align: center;
    margin-right: 38px;
    cursor: pointer;
}

header ul li a {
    color: #fff;
}

/* 导航栏激活样式 */
.active {
    border-bottom: 2px solid white;
}

/* 登录,注册按钮 */
header .login,
header .register {
    border-radius: 20px;
    padding: 6px 15px;

}

header .login a,
header .register a {
    color: var(--color);
}

header .login {
    border: 1px solid var(--color);
    margin-right: 8px;
    background-color: #0f62d1;
}

header .register {
    background-color: #ed510a;
    border: 1px solid #ed510a;
}

/* banner区 */
#banner,
.swiper-slide {
    height: var(--banner);
}

.swiper-slide:nth-child(1) {
    background: url(../images/banner1.png) no-repeat center center;
}

.swiper-slide:nth-child(2) {
    background: url(../images/banner2.png) no-repeat center center;
}

.swiper-slide:nth-child(3) {
    background: url(../images/banner3.png) no-repeat center center;
}




/* 云服务 */
#iCloud {
    height: 626px;
}

/* 云服务list */
#iCloud ul {
    padding-top: 30px;
}

#iCloud ul li {
    width: 240px;
    height: 280px;
    box-shadow: 2px 4px 8px #1271ef;
}



/* API分类 */
.APIclassify {
    width: 100%;
    height: 626px;
    background: url(../images/more-api-bg.svg) no-repeat 0px 0px;
    background-size: cover;
}

#APIclassify {
    height: 626px;
}

#APIclassify ul {
    flex-wrap: wrap;
    padding-top: 30px;
}

#APIclassify ul li {
    width: 224px;
    height: 138px;
    box-shadow: 2px 4px 8px #1271ef;
    text-align: center;
    padding: 30px 0;
    box-sizing: border-box;
    margin-bottom: 20px;
}

#APIclassify ul li p {
    margin-top: 15px;
}

.on {
    background-color: #2f7ee9;
    color: var(--color);
}



/* APImaster */
#APIMaster {
    height: 790px;
}

#APIMaster img {
    height: 560px;
}

#APIMaster ul {
    width: 508px;
    float: right;
    margin-top: 30px;
}

#APIMaster ul li {
    height: 80px;
    width: 100%;
    background-color: #fbfbfd;
    padding: 16px 18px;
    box-sizing: border-box;
    position: relative;
    margin-bottom: 10px;
}

#APIMaster ul li .bar {
    width: 4px;
    height: 24px;
    background-color: #0f62d1;
    position: absolute;
    top: 28px;
    left: 0;
}

#APIMaster ul li h4 {
    font-size: 20px;
    line-height: 22px;
    padding-left: 22px;
}

#APIMaster ul li:nth-child(1) h4 {
    background: url(../images/master-item-icon-01.svg) no-repeat 0px 4px;
}

#APIMaster ul li:nth-child(2) h4 {
    background: url(../images/master-item-icon-02.svg) no-repeat 0px 4px;
}

#APIMaster ul li:nth-child(3) h4 {
    background: url(../images/master-item-icon-03.svg) no-repeat 0px 4px;
}

#APIMaster ul li:nth-child(4) h4 {
    background: url(../images/master-item-icon-04.svg) no-repeat 0px 4px;
}

#APIMaster ul li:nth-child(5) h4 {
    background: url(../images/master-item-icon-05.svg) no-repeat 0px 4px;
}

#APIMaster ul li:nth-child(6) h4 {
    background: url(../images/master-item-icon-06.svg) no-repeat 0px 4px;
}

#APIMaster ul li p {
    font-size: 12px;
    line-height: 24px;
}


/* 独角兽部分 */
#enterprise {
    width: 100%;
    height: 560px;
}

/* 滚动部分 */
#enterprise .scroll {
    width: 100%;
    height: 270px;
    margin-top: 100px;
    background-color: #f8f9fb;
}

#enterprise .scroll .container {
    position: relative;
    background-color: #1271ef;
}

/* 图片部分 */
.leftPic {
    width: 580px;
    height: 290px;
    /* background: url(../images/hcfc.png); */
    position: absolute;
    top: -22px;
    left: 0;
}

.leftPic img {
    width: 580px;
    height: 290px;
}

/* 文字介绍 */
#enterprise .scroll article {
    width: 550px;
    float: right;
    position: relative;
}

/* 双引号图片 */
#enterprise .scroll article img {
    position: absolute;
    top: -22px;
    left: 0;
}

#enterprise .scroll article>p {
    font-size: 14px;
    line-height: 24px;
    margin-top: 50px;
}

#enterprise .scroll article>div {
    position: absolute;
    bottom: -60px;
    right: 0;
    width: 150px;
    font-size: 14px;
}

article>div p {
    float: right;
}

/* 小横条 */
.department>p::before {
    display: inline-block;
    content: "";
    width: 14px;
    height: 4px;
    background-color: #0f62d1;
    margin: 6px 13px 2px 0;
}



/* 企业资格 */
#certification {
    height: 440px;
    font-size: 12px;
}

#certification ul {
    width: 100%;
    height: 225px;
    display: flex;
    justify-content: space-around;
    align-items: center;
}

#certification ul li {
    float: left;
    width: 120px;
    height: 130px;
    /* line-height: 225px; */
    text-align: center;
}

#certification ul li>div {
    width: 120px;
    height: 90px;
    text-align: center;
    line-height: 80px;
    margin-bottom: 15px;
}

#certification ul li>div img {
    width: 90px;
    height: 90px;
}




/* 立即体验部分 */
#try {
    width: 100%;
    height: 240px;
    /* background-color: rgb(18, 113, 239); */
    background: url(../images/bottombg.png) no-repeat center center;
    background-size: cover;
    position: relative;
}

#try h1 {
    font-size: 40px;
    text-align: center;
    color: var(--color);
    padding-top: 70px;
}

#try span a {
    font-size: 12px;
    padding: 14px 40px;
    border: 1px solid var(--color);
    color: var(--color);
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translate(-50%);
}